import {
  ProForm,
  ProFormCascader,
  ProFormDateRangePicker,
  ProFormDigit,
  ProFormMoney,
  ProFormSelect,
  ProFormText,
  ProFormTreeSelect,
  ProFormDatePicker,
  ProFormTextArea,
  ModalForm,
  ProFormInstance,
  ProCard,
  ProTable,
  ProDescriptions,
  ProFormTimePicker,
  ProDescriptionsActionType,
} from '@ant-design/pro-components';
import ProLayout, {
  PageContainer,
  SettingDrawer,
  FooterToolbar,
} from '@ant-design/pro-layout';
import { history, useRequest } from 'umi';
import {
  EllipsisOutlined,
  PlusOutlined,
  CloudUploadOutlined,
  UploadOutlined,
  FileSearchOutlined,
} from '@ant-design/icons';
import {
  message,
  TreeSelect,
  Button,
  Card,
  Breadcrumb,
  Modal,
  Table,
  Space,
  Upload,
  UploadProps,
} from 'antd';
import React, { useEffect, useRef, useState } from 'react';
import { methods } from '@/utils/request';
import moment from 'moment';
import { TitleAdapter } from '@/pages/LabAchievements/ScientificResearch/component/commons/Adapter';
const { Item } = ProDescriptions;
export default () => {
  const [dataSource, setDataSource] = useState<any>([]);
  const [gutter, setGutter] = useState(12);
  const addPersonFrom = useRef<ProFormInstance>();
  const [filedDisable, setFiledDisable] = useState({
    username: true,
    technicalGrade: true,
    technicalName: true,
    type: true,
  });
  const [updateStatus, setUpdateStatus] = useState(false);

  const [reportId, setReportId] = useState(
    history.location.pathname.replace(
      '/LabAchievements/CooperationExchange/LabInvitedReport/Detail/',
      '',
    ),
  );
  const formRef = useRef<ProFormInstance>();
  const [proTableData, setProTableData] = useState([]);
  const [modalDataSource, setModalDataSource] = useState([]); //modal的数据源
  const [selectKeys, setSelectKeys] = useState<any>(); //modal checkbox默认选中
  const [saveType, setSaveType] = useState(''); //modal 点击确认 调用新增、更新还是暂存接口
  const [isModalVisible, setIsModalVisible] = useState(false);
  const actionRef = useRef<ProDescriptionsActionType>();

  const props: UploadProps = {
    name: 'file',
    action: 'http://10.1.40.84:9993/common/uploadFile',
    headers: {
      Authorization: localStorage.getItem('token') || '',
    },
    maxCount: 1,
    onChange(info) {
      if (info.file.status !== 'uploading') {
        console.log(info.file, info.fileList);
      }
      if (info.file.status === 'done') {
        formRef.current?.setFieldsValue({ annexPath: info.file.response.data });

        message.success(`${info.file.name} 上传成功！`);
      } else if (info.file.status === 'error') {
        message.error(`${info.file.name} file upload failed.`);
      }
    },
  };

  //报告详细信息
  const findLabStaffReportDetailById = useRequest(
    (data = null) => {
      return {
        url: 'http://10.1.40.84:9993/labStaff/findLabStaffReportDetailById',
        method: 'POST',
        headers: {
          Authorization: localStorage.getItem('token') || '',
        },
        data,
      };
    },
    {
      onSuccess: (result, params) => {
        setProTableData(result.userCommonRelations);
      },
      manual: true,
    },
  );

  //更新详细信息
  const updateLabStaffReport = useRequest(
    (data = null) => {
      return {
        url: 'http://10.1.40.84:9993/labStaff/updateLabStaffReport',
        method: 'POST',
        headers: {
          Authorization: localStorage.getItem('token') || '',
        },
        data,
      };
    },
    {
      manual: true,
      onSuccess: (result, params) => {
        if (result.code === 200) {
          history.push('/LabAchievements/CooperationExchange/LabInvitedReport');
        } else {
          message.error(result.msg);
        }
      },
      formatResult: (res) => res,
    },
  );

  //新增详细信息
  const addLabStaffReport = useRequest(
    (data = null) => {
      return {
        url: 'http://10.1.40.84:9993/labStaff/addLabStaffReport',
        method: 'POST',
        headers: {
          Authorization: localStorage.getItem('token') || '',
        },
        data,
      };
    },
    {
      manual: true,
      onSuccess: (result, params) => {
        if (result.code === 200) {
          history.push('/LabAchievements/CooperationExchange/LabInvitedReport');
        } else {
          message.error(result.msg);
        }
      },
      formatResult: (res) => res,
    },
  );

  //下拉框
  const getLike1 = useRequest(
    (data = {}) => {
      return {
        url: 'http://10.1.40.84:9993/getLike',
        method: 'POST',
        headers: {
          Authorization: localStorage.getItem('token') || '',
        },
        data,
      };
    },
    {
      manual: true,
    },
  );
  const getLike2 = useRequest(
    (data = {}) => {
      return {
        url: 'http://10.1.40.84:9993/getLike',
        method: 'POST',
        headers: {
          Authorization: localStorage.getItem('token') || '',
        },
        data,
      };
    },
    {
      manual: true,
    },
  );
  //查找所有标签
  const getAllLabel = useRequest((data = null) => {
    return {
      url: 'http://10.1.40.84:9993/getAllLabel',
      method: 'POST',
      headers: {
        Authorization: localStorage.getItem('token') || '',
      },
      data,
    };
  });

  //根据名字查找人详细信息
  const findOneUserInfoDetailByName = useRequest(
    (data = {}) => {
      return {
        url: 'http://10.1.40.84:9993/user/findOneUserInfoDetailByName',
        method: 'POST',
        headers: {
          Authorization: localStorage.getItem('token') || '',
        },
        data,
      };
    },
    {
      onSuccess: (result, params) => {
        console.log(result);
      },
      onError: (e, params) => {
        console.log(e);
        console.log(params);
      },
      // formatResult: res => res
      manual: true,
    },
  );

  const addOrUpdatePaperTemp = useRequest(
    (data = {}) => {
      return {
        url: 'http://10.1.40.84:9993/labStaff/addOrUpdateLabStaffReportTemp',
        method: 'POST',
        headers: {
          Authorization: localStorage.getItem('token') || '',
        },
        data,
      };
    },
    {
      onSuccess: (result, params) => {
        history.push('/LabAchievements/CooperationExchange/LabInvitedReport');
        console.log(result);
      },
      manual: true,
    },
  );

  const columns = [
    {
      title: '工号',
      dataIndex: 'username',
      key: 'username',
    },
    {
      title: '名称',
      dataIndex: 'realName',
      key: 'realName',
    },
    {
      title: '排名',
      dataIndex: 'userRank',
      key: 'userRank',
      valueType: 'digit',
    },
    {
      title: '人员类别',
      dataIndex: 'userType',
      key: 'userType',
      valueType: 'select',
      valueEnum: {
        固定人员: { text: '固定人员', status: 'Success' },
        流动人员: {
          text: '流动人员',
          status: 'Success',
        },
        学生: {
          text: '学生',
          status: 'Default',
        },
        非本室人员: {
          text: '非本室人员',
          status: 'Default',
        },
      },
    },
    {
      title: '人员身份',
      dataIndex: 'userIdentify',
      key: 'userIdentify',
      valueType: 'select',
      valueEnum: {
        第一作者: { text: '第一作者', status: 'Success' },
        通讯作者: {
          text: '通讯作者',
          status: 'Success',
        },
        其他: {
          text: '其他',
          status: 'Default',
        },
      },
    },
    {
      title: '人员职称',
      dataIndex: 'technicalName',
      key: 'technicalName',
    },
    {
      title: '职称等级',
      dataIndex: 'technicalGrade',
      key: 'technicalGrade',
      valueEnum: {
        正高级: { text: '正高级', status: 'Success' },
        副高级: {
          text: '副高级',
          status: 'Success',
        },
      },
    },
    {
      title: '完成情况',
      key: 'completeState',
      dataIndex: 'completeState',
      valueType: 'select',
      valueEnum: {
        独立完成: { text: '独立完成', status: 'Default' },
        '第一完成人(非独立完成)': {
          text: '第一完成人(非独立完成)',
          status: 'Error',
        },
        '非第一完成人(非独立完成)': {
          text: '非第一完成人(非独立完成)',
          status: 'Success',
        },
      },
    },

    {
      title: '操作',
      valueType: 'option',
      hideInTable: updateStatus,
      width: 200,
      render: (text, record: any, _, action) => [
        <a
          key="delete"
          onClick={() => {
            setDataSource(
              dataSource.filter(
                (item: any) => item.realName !== record.realName,
              ),
            );
            message.info('临时删除人员，确认人员名单后请提交！');
          }}
        >
          删除
        </a>,
      ],
    },
  ];
  //审核
  const updateStatusIpi = useRequest(
    (data = {}) => {
      return {
        url: 'http://10.1.40.84:9993/common/updateStatus',
        method: 'POST',
        headers: {
          Authorization: localStorage.getItem('token') || '',
        },
        data,
      };
    },
    {
      manual: true,
    },
  );

  //根据userList获取人员列表/user/getUserList
  const getUserList = useRequest(
    (data = {}) => {
      return {
        url: 'http://10.1.40.84:9993/user/getUserList',
        method: 'POST',
        headers: {
          Authorization: localStorage.getItem('token') || '',
        },
        data,
      };
    },
    {
      manual: true,
      onSuccess: (result) => {
        console.log(result);
        let resultTemp: any = [];
        result.map((item: any) => {
          resultTemp.push(item.webId);
        });
        console.log(resultTemp);
        setSelectKeys(resultTemp);
      },
    },
  );
  const showModal = (value: any) => {
    setModalDataSource(value);
    setIsModalVisible(true);
  };
  //添加标签
  const addLabelDetail = useRequest(
    (data = {}) => {
      return {
        url: 'http://10.1.40.84:9993/addLabelDetail',
        method: 'POST',
        headers: {
          Authorization: localStorage.getItem('token') || '',
        },
        data,
      };
    },
    {
      onSuccess: (result, params) => {
        getAllLabel.run();
        message.success('添加成功');
      },
      manual: true,
    },
  );
  const handleOk = () => {
    let paramTemp: any = [];
    selectKeys.map((element: any) => {
      paramTemp.push(
        getUserList?.data.filter((item: any) => item.webId === element)[0],
      );
    });
    let formRefData: any = formRef.current?.getFieldsValue();
    // if (saveType === '暂存') {
    //   addOrUpdateSoftWareCopyRightTemp.run({
    // ...eformdata,
    // startTime:moment(time[0]).format("YYYY-MM-DD"),
    // endTime:moment(time[1]).format("YYYY-MM-DD"),
    //     userCommonRelations: paramTemp,
    //   });
    // }
    console.log(formRefData);

    if (saveType === '新增') {
      addLabStaffReport.run({
        ...formRefData,
        userCommonRelations: paramTemp,
      });
    }
    if (saveType === '更新') {
      updateLabStaffReport
        .run({
          ...formRefData,
          userCommonRelations: paramTemp,
        })
        .then(() => {
          if (localStorage.getItem('isEdit') === '审核') {
            updateStatusIpi
              .run({
                tableName: 'LAB_STAFF_REPORT',
                ids: [reportId],
                status: 2, //审核通过
                tab: '子方向视角',
              })
              .then(() => {
                history.goBack();
                message.success('操作成功');
              });
          }
        });
    }
    if (saveType === '暂存') {
      let formRefData: any = formRef.current?.getFieldsValue();
      addOrUpdatePaperTemp.run({
        ...formRefData,
        userCommonRelations: paramTemp,
        id: reportId === 'new' ? null : reportId,
      });
    }
  };
  const handleCancel = () => {
    setIsModalVisible(false);
  };

  useEffect(() => {
    const pageTypeTemp = history.location.pathname.replace(
      '/LabAchievements/CooperationExchange/LabInvitedReport/Detail/',
      '',
    );
    setReportId(pageTypeTemp);
    if (pageTypeTemp != 'new') {
      findLabStaffReportDetailById.run({ id: pageTypeTemp }).then((data) => {
        const { year, ...formdata } = data;
        formRef?.current?.setFieldsValue({
          year: year ? moment(year, 'YYYY') : null,
          ...formdata,
        });
        actionRef.current?.reload(); //强制刷新ProDescriptions，回填数据
      });
    }
  }, []);

  return (
    <PageContainer
      header={{
        title:
          findLabStaffReportDetailById?.data?.message &&
          findLabStaffReportDetailById?.data?.isPass != 4 ? (
            <div style={{ fontSize: 18, textAlign: 'center', color: 'red' }}>
              拒绝原因：{findLabStaffReportDetailById?.data?.message}
            </div>
          ) : null,
        breadcrumb: (
          <Breadcrumb>
            <Breadcrumb.Item>合作交流</Breadcrumb.Item>
            <Breadcrumb.Item>实验室特邀报告</Breadcrumb.Item>
            <Breadcrumb.Item>
              {TitleAdapter(
                reportId,
                localStorage.getItem('isEdit'),
                '实验室特邀报告',
              )}
            </Breadcrumb.Item>
          </Breadcrumb>
        ),
      }}
      // extra={[
      //   <Button
      //     key="1"
      //     type="primary"
      //     onClick={() => {
      //       history.push(
      //         '/LabAchievements/CooperationExchange/LabInvitedReport',
      //       );
      //     }}
      //   >
      //     返回实验室特邀报告
      //   </Button>,
      // ]}
      extra={
        <div>
          {localStorage.getItem('isEdit') === '审核' ? (
            <Space>
              <ModalForm
                title="拒绝"
                trigger={<Button key="2">返回成员修改</Button>}
                autoFocusFirstInput
                modalProps={{
                  onCancel: () => console.log('run'),
                  destroyOnClose: true,
                }}
                submitTimeout={2000}
                onFinish={async (values) => {
                  console.log(values);
                  updateStatusIpi
                    .run({
                      tableName: 'LAB_STAFF_REPORT',
                      ids: [reportId],
                      status: 3, //拒绝
                      message: values.message,
                      tab: '子方向视角',
                    })
                    .then(() => {
                      history.goBack();
                      message.success('操作成功');
                    });
                  return true;
                }}
                grid={true}
                initialValues={{
                  message: findLabStaffReportDetailById?.data?.message,
                }}
              >
                <ProForm.Group>
                  <ProFormText
                    name="message"
                    label="拒绝原因"
                    placeholder="请输入拒绝原因"
                    colProps={{ span: 24 }}
                    rules={[{ required: true, message: '请输入拒绝原因' }]}
                  />
                </ProForm.Group>
              </ModalForm>

              <Button
                key="1"
                type="primary"
                onClick={() => {
                  let formRefData: any = formRef.current?.getFieldsValue();
                  if (!formRefData?.annexPath) {
                    message.warning('请上传材料！');
                  } else {
                    if (reportId === 'new') {
                      setSaveType('新增');
                    } else {
                      setSaveType('更新');
                    }
                    getUserList
                      .run({
                        userList: formRefData.authors.replace(/，/g, ','),
                      })
                      .then((e) => {
                        showModal(e);
                      });
                  }
                }}
              >
                提交管理员审核
              </Button>
            </Space>
          ) : null}
        </div>
      }
      content={
        <>
          {localStorage.getItem('isEdit') === '查看' ? (
            <>
              {findLabStaffReportDetailById?.data ? (
                <ProDescriptions
                  column={4}
                  request={async () => {
                    return Promise.resolve({
                      success: true,
                      data: findLabStaffReportDetailById?.data,
                    });
                  }}
                  actionRef={actionRef}
                  bordered
                  labelStyle={{ width: 170 }}
                >
                  <Item
                    label={'序号'}
                    dataIndex={'seq'}
                    span={4}
                    hideInDescriptions={
                      localStorage.getItem('identity') !== '管理员'
                    }
                  />
                  <Item
                    label={'年度'}
                    dataIndex={'year'}
                    span={4}
                    hideInDescriptions={
                      localStorage.getItem('identity') !== '管理员'
                    }
                  />
                  <Item label={'报告名称'} dataIndex={'reportName'} span={4} />
                  <Item label={'报告人'} dataIndex={'authors'} span={2} />
                  <Item label={'报告人单位'} dataIndex={'workUnit'} span={2} />
                  <Item
                    label={'报告人职称/职务'}
                    dataIndex={'reporterTechnicalGrade'}
                    span={2}
                  />
                  <Item
                    label={'报告人头衔'}
                    dataIndex={'reporterTechnicalName'}
                    span={2}
                  />
                  <Item
                    label={'开始时间'}
                    dataIndex={'startTime'}
                    span={2}
                    valueType={'date'}
                  />
                  <Item
                    label={'结束时间'}
                    dataIndex={'endTime'}
                    span={2}
                    valueType={'date'}
                  />
                  <Item label={'报道链接'} span={2}>
                    {findLabStaffReportDetailById.data?.reportLink ? (
                      <Button
                        type="link"
                        onClick={() => {
                          window.open(
                            findLabStaffReportDetailById.data.reportLink,
                          );
                        }}
                      >
                        {' '}
                        查看报道
                      </Button>
                    ) : (
                      '暂无报道'
                    )}
                  </Item>
                  <Item label={'佐证材料'} span={2}>
                    {findLabStaffReportDetailById.data?.annexPath ? (
                      <Button
                        type="link"
                        onClick={() => {
                          window.open(
                            findLabStaffReportDetailById.data.annexPath,
                          );
                        }}
                      >
                        {' '}
                        查看材料
                      </Button>
                    ) : (
                      '暂无材料'
                    )}
                  </Item>
                  <Item
                    label={'标签'}
                    dataIndex={'labels'}
                    span={4}
                    request={getAllLabel.data}
                    hideInDescriptions={
                      localStorage.getItem('identity') !== '管理员'
                    }
                  />
                </ProDescriptions>
              ) : null}
            </>
          ) : (
            <ProForm
              grid
              layout={'vertical'}
              onFinish={async (values) => {
                console.log(values);
                if (!values?.annexPath) {
                  message.warning('请上传材料！');
                } else {
                  if (reportId === 'new') {
                    setSaveType('新增');
                  } else {
                    setSaveType('更新');
                  }
                  getUserList
                    .run({ userList: values.authors.replace(/，/g, ',') })
                    .then((e) => {
                      showModal(e);
                    });
                }
                // if (reportId != 'new') {
                //   await updateLabStaffReport
                //     .run({ ...values, userCommonRelations: dataSource })
                //     .then((data) => {
                //       if (data) {
                //         message.success('修改成功');
                //         findLabStaffReportDetailById
                //           .run({ id: reportId })
                //           .then((data) => {
                //             formRef?.current?.setFieldsValue(data);
                //             setDataSource(data?.userCommonRelations || []);
                //           });
                //       } else {
                //         message.error('修改失败');
                //       }
                //     });
                // } else {
                //   await addLabStaffReport
                //     .run({ ...values, userCommonRelations: dataSource })
                //     .then((data) => {
                //       if (data) {
                //         message.success('添加成功');
                //         history.push(
                //           '/LabAchievements/CooperationExchange/LabInvitedReport',
                //         );
                //       } else {
                //         message.error('添加失败');
                //       }
                //     });
                // }
              }}
              autoFocusFirstInput
              formRef={formRef}
              submitter={{
                render: (props, dom) => (
                  <FooterToolbar>
                    {localStorage.getItem('isEdit') === '审核' ? null : (
                      <>
                        {reportId === 'new' ||
                        findLabStaffReportDetailById?.data?.isPass + '' ===
                          '-1' ? (
                          <Button
                            onClick={() => {
                              setSaveType('暂存');
                              let values = props.form?.getFieldsValue();
                              if (values.authors) {
                                getUserList
                                  .run({ userList: values.authors })
                                  .then((e) => {
                                    showModal(e);
                                  })
                                  .catch((e) => message.error('作者填写有误'));
                              } else {
                                addOrUpdatePaperTemp.run({
                                  ...values,
                                  userCommonRelations: proTableData,
                                  id: reportId === 'new' ? null : reportId,
                                });
                              }
                            }}
                          >
                            暂存
                          </Button>
                        ) : null}
                        <Button
                          type="primary"
                          onClick={() => {
                            // console.log("?");
                            formRef.current?.submit();
                          }}
                        >
                          提交
                        </Button>
                        {/* {dom} */}
                      </>
                    )}
                  </FooterToolbar>
                ),
              }}
            >
              <ProFormDigit label="编号" name={'id'} hidden />
              <ProFormDigit name={'isPass'} hidden />
              <ProFormText name="annexPath" hidden />
              <ProForm.Group title={'基本信息'}>
                <ProFormDigit
                  label="序号"
                  name={'seq'}
                  colProps={{ span: 4 }}
                  disabled
                  hidden={true}
                />
                <ProFormText
                  label="报告名称"
                  name={'reportName'}
                  colProps={{ span: 6 }}
                  rules={[{ required: true, message: '请输入' }]}
                />
                <ProFormText
                  label="报告人（作者信息中本人姓名为英文的请改成中文）"
                  name={'authors'}
                  colProps={{
                    span: 6,
                  }}
                  rules={[{ required: true, message: '请输入' }]}
                  placeholder="添加人员信息，以英文逗号分隔"
                />
              </ProForm.Group>
              <ProForm.Group title="详细内容">
                <ProFormDatePicker.Year
                  label="年度"
                  name="year"
                  colProps={{ span: 3 }}
                  hidden={localStorage.getItem('identity') !== '管理员'}
                />
                <ProFormText
                  label="报告人职称/职务"
                  name={'reporterTechnicalGrade'}
                  colProps={{ span: 3 }}
                  rules={[{ required: true, message: '请输入报告人职称/职务' }]}
                />
                <ProFormText
                  label="报告人单位"
                  name={'workUnit'}
                  colProps={{ span: 3 }}
                  rules={[{ required: true, message: '请输入报告人单位' }]}
                />
                <ProFormText
                  label="报告人头衔"
                  name={'reporterTechnicalName'}
                  colProps={{ span: 3 }}
                />

                <ProFormDateRangePicker
                  label="会议开始时间—会议结束时间"
                  name="time"
                  colProps={{ span: 6 }}
                  rules={[{ required: true, message: '请选择' }]}
                />
              </ProForm.Group>
              <ProForm.Group title="佐证材料">
                {/* <ProFormDatePicker
                label="开始时间"
                name="startTime"
                colProps={{ span: 3 }}
              />
              <ProFormDatePicker
                label="结束时间"
                name="endTime"
                colProps={{ span: 3 }}
              /> */}

                <ProFormText
                  name="reportLink"
                  label="报道链接"
                  colProps={{
                    span: 6,
                  }}
                />
                <ProFormSelect.SearchSelect
                  label="实验室特邀报告标签"
                  name={'labels'}
                  fieldProps={{ labelInValue: false }}
                  colProps={{ span: 6 }}
                  options={getAllLabel.data}
                  hidden={localStorage.getItem('identity') !== '管理员'}
                  addonAfter={
                    <ModalForm<{
                      year: string;
                      labelName: string;
                    }>
                      title="新增标签"
                      trigger={<a>新增标签</a>}
                      autoFocusFirstInput
                      modalProps={{
                        onCancel: () => console.log('run'),
                      }}
                      submitTimeout={2000}
                      onFinish={async (values) => {
                        addLabelDetail.run(values);
                        return true;
                      }}
                    >
                      <ProForm.Group>
                        <ProFormDatePicker.Year
                          width="md"
                          name="year"
                          label="标签年份"
                          required
                        />
                        <ProFormText
                          width="md"
                          name="labelName"
                          label="标签名称"
                          required
                        />
                      </ProForm.Group>
                    </ModalForm>
                  }
                />
              </ProForm.Group>
              <Upload {...props}>
                <Button
                  icon={<UploadOutlined />}
                  type="link"
                  onClick={() =>
                    message.info(
                      '请选择.docx、.doc、.pdf、.xls格式的文件上传！！',
                    )
                  }
                >
                  上传材料（上传会议照片，以会议名称命名）
                </Button>
              </Upload>
              {formRef?.current?.getFieldValue('annexPath') ? (
                <Button
                  type="link"
                  onClick={() => {
                    window.open(formRef?.current?.getFieldValue('annexPath'));
                  }}
                  icon={<FileSearchOutlined />}
                >
                  {' '}
                  查看材料
                </Button>
              ) : (
                <Button type="link"> 暂无材料</Button>
              )}
            </ProForm>
          )}
        </>
      }
    >
      <Modal
        title="请确认人员！"
        visible={isModalVisible}
        onOk={handleOk}
        onCancel={handleCancel}
        forceRender
      >
        <Table
          size="small"
          pagination={{ hideOnSinglePage: true, pageSize: 10 }}
          rowKey={'webId'}
          rowSelection={{
            onChange: (
              selectedRowKeys: React.Key[],
              selectedRows: DataType[],
            ) => {
              setSelectKeys(selectedRowKeys);
            },
            selectedRowKeys: selectKeys,
          }}
          columns={[
            {
              title: '工号',
              dataIndex: 'username',
              key: 'username',
            },
            {
              title: '姓名',
              dataIndex: 'realName',
              key: 'realName',
            },
            {
              title: '人员类型',
              dataIndex: 'userType',
              key: 'userType',
            },
          ]}
          dataSource={modalDataSource}
        />
      </Modal>
    </PageContainer>
  );
};
